/*
 * @Date: 2022-02-15 09:46:30
 * @LastEditors: wuyuxin
 * @LastEditTime: 2022-02-16 14:43:45
 * @FilePath: \webpack-learning\04_webpack处理其他资源02\src\js\component.js
 * @description: 文件描述
 */
// import 'css-loader!../css/index.css'
import '../css/index.css'
import '../css/component.less'

import zznhImage from "../img/zznh.png"
function component() {
  const element = document.createElement("div");

  element.innerHTML = ["Hello", "Webpack"].join(" ");
  element.className = "content";

    // 创建一个img元素,设置src属性
    const imgEl = new Image()
    // imgEl.src = require('../img/zznh.png').default
    imgEl.src = zznhImage
    element.appendChild(imgEl)
  
    // 创建一个div, 设置背景图片
    const bgDivEl = document.createElement('div')
    bgDivEl.style.width = 200 + 'px'
    bgDivEl.style.height = 200 + 'px'
    bgDivEl.className = 'bg-image'
    bgDivEl.style.backgroundColor = "red"
    element.appendChild(bgDivEl)

    // 创建一个div, 设置背景图片
    const bgDivEl1 = document.createElement('div')
    bgDivEl1.style.width = 200 + 'px'
    bgDivEl1.style.height = 200 + 'px'
    bgDivEl1.className = 'bg-image2'
    bgDivEl1.style.backgroundColor = "red"
    element.appendChild(bgDivEl1)

    // 创建一个i元素,设置一个字体
    const iEl = document.createElement("i")
    iEl.className = "iconfont w_icon icon-ashbin";
    element.appendChild(iEl)

  return element;
}

document.body.appendChild(component());